<template>
  <j-modal
    :title="title"
    :width="1400"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    :dialog-style="{ top: '20px' }"
    :maskClosable="false"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-spin :spinning="confirmLoading">
      <a-card :bordered="false">
      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :xl="4" :lg="7" :md="8" :sm="24">
                <a-form-item label="品牌">
                  <a-select allowClear defaultValue="1" v-model="queryParam.brandCode" showSearch
                    :filter-option="filterOption" :not-found-content="null">
                    <a-select-option v-for="item in brandList" :key="item.id" :value="item.brandCode">
                      {{ item.brandName }}
                    </a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <a-form-item label="编码">
                <a-input placeholder="" v-model="queryParam.itemCode" allowClear></a-input>
              </a-form-item>
            </a-col>
            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <a-form-item label="名称">
                <a-input placeholder="" v-model="queryParam.itemName" allowClear></a-input>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="零售价格">
                <a-input-group compact>
                  <template v-if="inputType == 'between'">
                    <a-input-number
                      style="width: 100px; text-align: center"
                      placeholder="最小值"
                      v-model="queryParam.beginPrice"
                      allowClear
                    />
                    <a-input
                      style="width: 30px; border-left: 0; pointer-events: none; backgroundcolor: #fff"
                      placeholder="~"
                      disabled
                    />
                    <a-input-number
                      style="width: 100px; text-align: center; border-left: 0"
                      placeholder="最大值"
                      v-model="queryParam.endPrice"
                      allowClear
                    />
                  </template>
                </a-input-group>
              </a-form-item>
            </a-col>
            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <a-form-item label="价格尾数">
                <a-select v-model="queryParam.priceTail" allowClear>
                  <a-select-option v-for="(item, index) in priceTail" :key="index" :value="item.value">
                    {{ item.text }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <a-form-item label="季节">
                <a-select v-model="queryParam.itemSession" allowClear>
                  <a-select-option v-for="(item, index) in itemSession" :key="index" :value="item.value">
                    {{ item.text }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>

            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <a-form-item label="类型">
                <a-select v-model="queryParam.itemType" allowClear>
                  <a-select-option v-for="(item, index) in itemType" :key="index" :value="item.value">
                    {{ item.text }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>

            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="上架时间">
                <a-range-picker
                  :ranges="{ 今天: [moment(), moment()], 本月: [moment().startOf('month'), moment().endOf('month')] }"
                  v-model="shelevsDateRange"
                  @change="handleChange"
                />
              </a-form-item>
            </a-col>

            <a-col :xl="4" :lg="7" :md="8" :sm="24">
              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                <a-button type="default" @click="searchReset1" icon="reload" style="margin-left: 8px">重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>

      <!-- 操作按钮区域 -->
      <!-- <div class="table-operator">
        
      </div> -->

      <!-- table区域-begin -->
      <div>
        <div>
          <a-checkbox v-model="selectAll" style="margin-bottom: 10px" @change="handleChangeAll"
            >全选所有结果<span style="color:red;font-weight: 700;">{{ selectLabel }}</span>.单次最多5000条</a-checkbox
          >
        </div>
        <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
          <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
          <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
          >项
          <a style="margin-left: 24px" @click="onClearSelected">清空</a>
        </div>
        <a-table
          ref="table"
          size="middle"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap"
          :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
          @change="handleTableChange"
        >
          <span slot="pstatus" slot-scope="text">
            <span v-if="text === 1">上架</span>
            <span v-else>下架</span>
          </span>
          <span slot="photo" slot-scope="text">
            <a-avatar shape="square" :src="text + '?x-oss-process=image/resize,w_50,h_50'"> </a-avatar>
          </span>
        </a-table>
      </div>
      <!-- table区域-end -->
    </a-card>
    </a-spin>
  </j-modal>
</template>

<script>
import '@/assets/less/TableExpand.less'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import moment from 'moment'
import { postAction } from '@/api/manage'
import { queryMerchantBussList } from '@/api/api'
import { filterObj } from '@/utils/util'

export default {
  name: 'SelectProductSpuList',
  mixins: [JeecgListMixin],
  components: {},
  data() {
    return {
      title: '选择商品',
      confirmLoading: false,
      disableMixinCreated: true,
      moment,
      visible: false,
      selectAll: false,
      inputType: 'between',
      orgList: [{ id: 'af139730e3ac474eabb17c6045afb7e3', departName: '鸣远路' }],
      shelevsDateRange: [],
      actModel: {},
      selectLabel: '',
      brandList: [
      ],
      itemSession: [
        { text: '春', value: '春' },
        { text: '夏', value: '夏' },
        { text: '秋', value: '秋' },
        { text: '冬', value: '冬' },
      ],
      itemType: [
        { text: '正价', value: '正价' },
        { text: '砍货', value: '砍货' },
        { text: '代卖', value: '代卖' },
      ],
      priceTail: [
        { text: '0', value: '0' },
        { text: '1', value: '1' },
        { text: '2', value: '2' },
        { text: '3', value: '3' },
        { text: '4', value: '4' },
        { text: '5', value: '5' },
        { text: '6', value: '6' },
        { text: '7', value: '7' },
        { text: '8', value: '8' },
        { text: '9', value: '9' },
      ],
      yesNoState: [
        { text: '是', value: '1' },
        { text: '否', value: '0' },
      ],
      pStatus: [
        { text: '上架', value: '1' },
        { text: '下架', value: '0' },
      ],
      description: '产品管理管理页面',
      // 表头
      columns: [
        {
          title: '所属机构',
          align: 'center',
          dataIndex: 'orgName',
        },
        {
          title: '商品编码',
          align: 'center',
          dataIndex: 'itemCode',
        },
        {
          title: '商品名称',
          align: 'center',
          dataIndex: 'itemName',
        },
        {
          title: '季节',
          align: 'center',
          dataIndex: 'itemSession',
        },
        {
          title: '类型',
          align: 'center',
          dataIndex: 'itemType',
        },
        {
          title: '所属分类',
          align: 'center',
          dataIndex: 'itemCateName',
        },
        {
          title: '供应价',
          align: 'center',
          dataIndex: 'supplyPrice',
        },
        {
          title: '零售价',
          align: 'center',
          dataIndex: 'markPrice',
        },
        {
          title: '品牌',
          align: 'center',
          dataIndex: 'brandName',
        },
        {
          title: '状态',
          align: 'center',
          dataIndex: 'pstatus',
          scopedSlots: { customRender: 'pstatus' },
        },
        {
          title: '上架日期',
          align: 'center',
          dataIndex: 'createTime',
          customRender: (text) => {
            return text ? text.substring(0, 10) : ''
          },
        },
        // {
        //   title: '参与活动',
        //   align: 'center',
        //   dataIndex: 'actFlag',
        //   customRender: (text) => {
        //     return text == 1 ? '是' : '否'
        //   },
        // },
        // {
        //   title: '参与积分',
        //   align: 'center',
        //   dataIndex: 'pointsFlag',
        //   customRender: (text) => {
        //     return text == 1 ? '是' : '否'
        //   },
        // },
      ],
      url: {
        add: '/marketing/posMarketAct/add',
        list: '/stock/supplyProductSpu/list',
        shopListUrl: '/sys/sysDepart/getMyDepartList',
        setting: '/stock/supplyProductSpu/setting',
        prodSelectAll: '/marketing/posGoodsSaleRule/prodSelectAll',
      },
    }
  },
  computed: {},
  created() {
    this.loadBrandList()
  },
  methods: {
    loadBrandList() {
      this.brandList = []
      queryMerchantBussList({ 'bussType': 'BRAND' }).then((res) => {
        if (res.success) {
          for (let a of res.result) {
            this.brandList.push({ brandName: a.bussName, brandCode: a.bussCode })
          }
        }
      })
    },
    searchReset1() {
      this.queryParam.itemCode = ''
      this.queryParam.itemName = ''
      this.queryParam.beginPrice = ''
      this.queryParam.endPrice = ''
      this.queryParam.priceTail = ''
      this.queryParam.itemSession = ''
      this.queryParam.itemType = ''
      this.queryParam.beginTime = ''
      this.queryParam.endTime = ''
      this.queryParam.brandCode = ''

      this.selectAll = false

      this.loadData()
    },
    search(orgIds, record) {
      console.log('record=', record)
      this.actModel = record
      this.actModel.orgIds = orgIds
      this.queryParam={}
      this.selectLabel = ''
      this.queryParam.pStatus = '1'
      this.queryParam.orgIds = orgIds
      this.queryParam.excludeActId = record.id
      // this.queryParam.actFlag = 1
      // this.loadShopList()
      this.loadData(1)
    },
    close() {
      this.selectAll=false
      this.onClearSelected()
      this.$emit('close')
      this.visible = false
    },
    buildParam() {
      console.log(this.selectionRows)
      let param = []
      for (let item of this.selectionRows) {
        let goodSaleRule = {
          actId: this.queryParam.excludeActId,
          ruleType: 11,
          productSpuId: item.id,
          itemCode: item.itemCode,
          markPrice: item.markPrice,
        }
        param.push(goodSaleRule)
      }
      return filterObj(param)
    },
    handleChangeAll(e) {
      let checked = e.target.checked
      let total = this.ipagination.total
      if (checked) {
        this.selectLabel = '(' + total + '条)'
      } else {
        this.selectLabel = ''
      }
    },
    handleAll() {
      let total = this.ipagination.total
      if (total <= 0) {
        this.$message.warning('商品不能为空')
        return
      }

      if (total > 5000) {
        this.$message.warning('最多5000条')
        return
      }
      let queryParam1 = Object.assign({},this.queryParam)
      queryParam1.orgIds = [queryParam1.orgIds]
      console.log('queryParam1', queryParam1)
      
      let param = {
        actId: this.actModel.id,
        ruleType: 11,
        total: total,
        actType: this.actModel.actType,
        query: queryParam1,
        prodScope: this.actModel.prodScope,
      }

      this.confirmLoading = true
      let that = this

      postAction(this.url.prodSelectAll, param)
        .then((res) => {
          if (res.success) {
            this.$emit('ok', this.selectionRows)
            this.close()
          } else {
            that.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.confirmLoading = false
        })
    },
    handleOk() {
      let isSelect = this.selectAll || this.selectionRows.length > 0
      if (!isSelect) {
        this.$message.warning('请选择商品!')
        return false
      }

      if (this.selectAll) {
        this.handleAll()
        return
      }

      this.confirmLoading = true
      let that = this
      let goodsSaleRuleInVos = this.buildParam()
      let param = {
        saveModal: 'DETAIL',
        actType: this.actModel.actType,
        id: this.actModel.id,
        prodScope: this.actModel.prodScope,
        goodsSaleRuleInVos: goodsSaleRuleInVos,
      }
      postAction(this.url.add, param)
        .then((res) => {
          if (res.success) {
            this.$emit('ok', this.selectionRows)
            this.close()
          } else {
            that.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.confirmLoading = false
        })
    },
    handleCancel() {
      this.close()
    },
    loadShopList() {
      this.orgList = []
      postAction(this.url.shopListUrl + '?type=2').then((res) => {
        if (res.success) {
          this.orgList = res.result
        }
      })
    },
    filterOption(input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    },
    handleChange(date, dateString) {
      this.queryParam.beginTime = dateString[0]
      this.queryParam.endTime = dateString[1]
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>